<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta name="viewport" content="initial-scale=1, user-scalable=0, minimal-ui" charset="UTF-8">
	<script src="js/echarts.min.js"></script>
	<script src="js/jquery-3.2.1.min.js"></script>
</head>
<style type="text/css">
		.main{
			width: 95vw;
			height: 60vw;
		}
		.tableDiv{
			width: 100%;
			height: 63vw;
			display: flex;
			justify-content: center;
			align-items: center;
			background: #ffffff;
			background-size:100% 100%;
			margin-bottom: 5vh;
		}

	</style>
<body  >
<!-- 为ECharts准备一个具备大小（宽高）的Dom -->
<div class="tableDiv" >
	<div id="main" class="main"></div>
</div>
<div class="tableDiv" >
	<div id="main1" class="main"></div>
</div>
</body>

<script type="text/javascript">

		function findLearn(pointData){
		var lineChart = echarts.init(document.getElementById('main'));
		var option = {
			title: {
				text: '七日积分趋势图',
				left: 'center',
				textStyle: {
				  fontWeight: "normal",
				  color: "#333333",
				  fontSize: 16
				},
			},
		    xAxis: {
				data: [],
		        type: 'category',
		        boundaryGap: false,
				axisLine:{
					lineStyle:{
						color:'#333333'
					}
				}
		    },
		    yAxis: {
		        type: 'value',
				axisLine:{
					lineStyle:{
						color:'#333333'
					}
				}
		    },
		    series: [{
				data: [],
		        type: 'line',
		        areaStyle: {},

		    }]
		};
		for(var i = 0;i<pointData.dayPointList.length;i++){
			var dayPoint = pointData.dayPointList[i]
			option.xAxis.data.push(dayPoint.scoreDay)
			option.series[0].data.push(dayPoint.score)
		}

		lineChart.setOption(option)

		var rateChart = echarts.init(document.getElementById('main1'));
		var option1 = {
    title: {
        text: '积分来源分布情况',
        left: 'left'
    },
    tooltip: {
        trigger: 'item',
        formatter: '{a} <br/>{b} : {c} ({d}%)'
    },
    legend: {
        type: 'scroll',
        orient: 'vertical',
        right: 10,
        top: 20,
        bottom: 20,
    },
    series: [
        {
            name: '积分来源',
            type: 'pie',
            radius: '55%',
            center: ['40%', '50%'],
            emphasis: {
                itemStyle: {
                    shadowBlur: 10,
                    shadowOffsetX: 0,
                    shadowColor: 'rgba(0, 0, 0, 0.5)'
                }
            }
        }
    ]
};
option1.series[0].data = pointData.ratePointList
		for(var j = 0;i<pointData.ratePointList.length;j++){
			var dayPoint = pointData.ratePointList[j]
			option1.legend.data.push(dayPoint.label)
		}
rateChart.setOption(option1)
		}
	</script>
</html>
